<template>
	<view id="myMachine">
		<view class="pageHeader">
			<uni-search-bar class="search" v-model="searchTitle" @confirm="search" @input="search" @cancel="cancel" placeholder="请输入问题" />
		</view>
		<uni-collapse  accordion  @change="change">
			<view v-for="(item,index) in list" :key="index">
				<uni-collapse-item :title="item.title" :thumb="item.cpCover">
					<view class="content" v-for="(pr,pi) in item.data.problem" :key="pi" @click="getDetail(pr)">
						<image :src="pr.cover_list" class="imgs"></image>
						<text class="text">{{pr.pName}}</text>
						<text class="icon"><i class="iconfont icon-right"></i></text>
					</view>
				</uni-collapse-item>
			</view>
		</uni-collapse>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				searchTitle:'',
				list:[]
			}
		},
		mounted() {
			this.getProductList()
		},
		methods: {
			search(e) {
				console.info(e)
				this.searchTitle=e
			},
			cancel(){
				this.searchTitle=''
			},
			getProductList(){
				this.httpClient.post('stock/app/problem/getProblemList', {
					title:this.searchTitle
				}).then(res=>{
					if(res.code==200){
						this.list=res.data
					}
				})
				
				// this.httpClient.post('stock/app/problem/getProblemList', {
				// 	title:this.searchTitle
				// }).then(res=>{
				// 	if(res.code==200){
						
				// 	}
				// })
				
				
			},
			getDetail(e){
				uni.navigateTo({
					url:'problemList?id='+e.product_id+'&name='+e.pName+'&search='+this.searcher
				})
			},
			change(e){
				console.info(e)
			}
		}
	}
</script>

<style scoped lang="scss">
	#myMachine{
		.pageHeader{
			height:120rpx;
			background:#FFF;
			margin-bottom:10rpx;
		}
		.content{
			padding:20rpx 20rpx 20rpx 80rpx;border-top:1rpx dashed #eee;color:#888;
			display:flex;align-self: center;
			.imgs{
				width:50rpx;height:50rpx;
			}
			.text{
				flex:1;line-height:50rpx;margin-left:20rpx;
			}
			.icon{
				width:40rpx;
				i.iconfont{
					font-sizse:24rpx;color:#CCC;
				}
			}
		}
	}
</style>
